/*
 * @Author: wangtao
 * @Date: 2021-02-18 11:21:01
 * @LastEditors: 汪滔
 * @LastEditTime: 2021-04-22 14:57:06
 * @Description: file content
 */
import React from 'react';
import {
  View,
  StyleSheet,
  SafeAreaView,
  ScrollView,
} from 'react-native';
import {
  Button,
  msg,
} from '@/common';
import {
  fontColorBlack,
  mainBgColorLightGray,
  px2dp,
} from '@/styles';
import api from '@/api';
import ApplyTitle from './components/apply-title';
import ApplyInfo from './components/apply-info';
import CertWrap from './components/cert-wrap';
import ApplyTips from './components/apply-tips';

const { Submit } = Button;

export default class InsuranceApplyMy extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      applicationInsuranceDetailId: '', // 申请详情id
      applicationInsuranceDetail: {}, // 申请详情
    };
  }

  componentDidMount() {
    const { navigation } = this.props;
    const state = navigation.state || {};
    const params = state.params || {};
    const { id } = params;
    this.setState({ applicationInsuranceDetailId: id });
    this.getApplicationInsuranceDetail(id);
  }

  componentWillUnmount() {}

  render() {
    const {
      applicationInsuranceDetailId,
      applicationInsuranceDetail,
    } = this.state;
    if (!applicationInsuranceDetail.id) {
      return null;
    }
    return (
      <SafeAreaView style={{ flex: 1 }}>
        <View style={styles.container}>
          <ScrollView
            contentContainerStyle={styles.scrollContainer}
            showsVerticalScrollIndicator={false}
          >
            {!!applicationInsuranceDetail.rejectReasons && (
              <ApplyTips
                applicationInsuranceDetail={applicationInsuranceDetail}
              />
            )}
            <ApplyTitle
              applicationInsuranceDetail={applicationInsuranceDetail}
            />
            <ApplyInfo
              applicationInsuranceDetail={applicationInsuranceDetail}
            />
            <CertWrap applicationInsuranceDetail={applicationInsuranceDetail} />
            <View style={styles.btnWrap}>
              {this._renderBtn(applicationInsuranceDetail)}

              {/* <Submit
              text="申请保理融资"
              boxStyle={{
                width: px2dp(280),
                height: px2dp(88),
                borderRadius: px2dp(12),
                overflow: 'hidden',
                marginTop: px2dp(32),
              }}
              btnStyle={{}}
              btnTextStyle={{
                fontSize: px2dp(28),
                fontWeight: 'bold',
              }}
              onClick={() => {}}
            /> */}
            </View>
          </ScrollView>
        </View>
      </SafeAreaView>
    );
  }

  _renderBtn = (applicationInsuranceDetail) => {
    let applicationStatusCode =
      applicationInsuranceDetail.applicationStatus.code;
    if (
      applicationStatusCode == 'SUBMITTED'
    ) {
      return (
        <>
          <Submit
            text='上传保单'
            boxStyle={{
              width: px2dp(560),
              height: px2dp(88),
              borderRadius: px2dp(12),
              overflow: 'hidden',
              marginTop: px2dp(32),
              backgroundColor: '#E6E6E5',
            }}
            btnStyle={{}}
            btnTextStyle={{
              fontSize: px2dp(28),
              fontWeight: 'bold',
              color: fontColorBlack,
            }}
            onClick={() => {
              msg.emit('router: goToNext', {
                routeName: 'InsuranceUpload',
                applicationInsuranceDetailId: applicationInsuranceDetail.id,
              });
            }}
          />
        </>
      );
    }
    if (
      applicationStatusCode == 'REJECT'
    ) {
      return (
        <>
          <Submit
            text='重新上传保单'
            boxStyle={{
              width: px2dp(560),
              height: px2dp(88),
              borderRadius: px2dp(12),
              overflow: 'hidden',
              marginTop: px2dp(32),
            }}
            btnStyle={{}}
            btnTextStyle={{
              fontSize: px2dp(28),
              fontWeight: 'bold',
            }}
            onClick={() => {
              msg.emit('router: goToNext', {
                routeName: 'InsuranceUpload',
                applicationInsuranceDetailId: applicationInsuranceDetail.id,
              });
            }}
          />
        </>
      );
    }
    if (applicationStatusCode == 'NOT_SUBMITTED') {
      return (
        <>
          <Submit
            text='提交申请'
            boxStyle={{
              width: px2dp(560),
              height: px2dp(88),
              borderRadius: px2dp(12),
              overflow: 'hidden',
              marginTop: px2dp(32),
              backgroundColor: '#E6E6E5',
            }}
            btnStyle={{}}
            btnTextStyle={{
              fontSize: px2dp(28),
              fontWeight: 'bold',
              color: fontColorBlack,
            }}
            onClick={() => {
              msg.emit('router: goToNext', {
                routeName: 'InsuranceApplyForm',
                applicationNo: applicationInsuranceDetail.applicationNo,
              });
            }}
          />
        </>
      );
    }
  };

  // 我的申请详情
  getApplicationInsuranceDetail = (id) => {
    api.insurance.applicationInsuranceDetail(id).then((res) => {
      if (res.success) {
        this.setState({ applicationInsuranceDetail: res.data });
      } else {
        msg.emit('app:tip', { text: res.msg });
      }
    });
  };

  onChange = (key, val) => {
    this.setState({ [key]: val });
  };
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: mainBgColorLightGray,
    alignItems: 'center',
  },
  scrollContainer: {
    alignItems: 'center',
    paddingBottom: px2dp(80),
  },
  btnWrap: {
    width: '100%',
    flexDirection: 'row',
    justifyContent: 'center',
  },
});
